<template>
  <div id="app" style="color:#333">
    <my-header/>
    <router-view/>
    <myFooter/>
  </div>
</template>

<script>
import myHeader from './components/header'
import myFooter from './components/footer'
export default {
  name: 'App',
  components: {
    myHeader,
    myFooter
  },
  mounted () {
    // this.$api.get(
    //   'financial/info',
    //   {id: 86},
    //   r => {
    //     console.log(r)
    //     $('#app').css('color', 'blue')
    //     console.log()
    //   }
    // )
  }
}
</script>

<style lang='scss'>
#app {
  color: #333;
}
input::-webkit-input-placeholder {
  color: #999 !important;
}
input:-moz-placeholder {
  color: #999 !important;
}
input::-moz-placeholder {
  color: #999 !important;
}
input:-ms-input-placeholder {
  color: #999 !important;
}
.el-input__inner:hover{
  border-color: #e3e3e3 !important;
}
.el-input__inner{
  color: #333 !important;
}
.el-select .el-input__inner:focus{
  border-color: #ff6f3c !important;
}
.el-input.is-active .el-input__inner, .el-input__inner:focus{
  border-color: #ff6f3c !important;
}
.el-select-dropdown__item.hover, .el-select-dropdown__item:hover{
  background: #fff8f6 !important;
}
.el-select-dropdown__item.selected{
  color: #ff6f3c !important;
}
.el-date-table td.available:hover{
  color: #ff6f3c !important;
}
.el-date-table td.today span{
  color: #ff6f3c !important;
}
.el-date-table td.current:not(.disabled) span{
  background: #ff6f3c !important;
}
.el-picker-panel__icon-btn:hover,.el-date-picker__header-label.active, .el-date-picker__header-label:hover,.el-year-table td .cell:hover, .el-year-table td.current:not(.disabled) .cell,.el-month-table td .cell:hover, .el-month-table td.current:not(.disabled) .cell{
  color: #ff6f3c !important;
}
.el-date-editor.el-input{
  width: 436px;
  height: 36px;
  .el-input__inner{
    height: 34px;
    line-height: 34px;
    border-radius: 0;
    padding-left: 10px;
  }
  .el-input__prefix, .el-input__suffix{
    display: none;
  }
}
.el-select{
  .el-input__inner{
    height: 34px;
    line-height: 34px;
    border-radius: 0;
    padding-left: 10px;
  }
  .el-input__suffix{
    right: 20px !important;
  }
}
$fff:#fff;
$default:#333;
$blue: #ff6f3c;
$btnwidth:240px;
$btnheight:50px;
/* width */
$innerWidth:1200px;
.clearfix:after {content:"200B";display:block;font-size:0;height:0;clear:both;visibility: hidden;}
/* IE6/7 */
.clearfix {*zoom:1;}
html {color:#333;font: 14px/1 "microsoft yahei",arial;}
html,body,div,h1,h2,h3,h4,h5,h6,p,ul,ol,li,dl,dt,dd,img,input,textarea,form {margin:0;padding:0;}
h1, h2, h3, h4, h5, h6 { clear: both;  font-weight: normal; }
ul ,ol {list-style:none;}
sup {vertical-align:text-top;}
sub {vertical-align:text-bottom;}
em {font-style: normal;font-weight: 400;}
strong {font-style: normal;font-weight: 400;}
table{border-collapse:collapse;border-spacing:0;}
table td,table th {padding: 0;}
a{
  text-decoration: none;
  cursor: pointer;color: #333;
  &:visited{
    color: #333;
  }
  &:active {color: $blue;}
  &:hover {
    outline:none;
    color: $blue;
  }
  &{
    cursor: pointer;
  }
  * {cursor: pointer;}
}
img{border:0;}
input,textarea {border:none;/* outline:medium; */}
input,button,a {outline:0 none !important;}
select {*outline:none;font: 14px/1 arial,"microsoft yahei";}
input {vertical-align: middle;}
/* html5 */
article,aside,dialog,footer,header,section,footer,nav,figure,menu{display:block;}
::-ms-clear,::-ms-reveal{display:none;}
textarea{
  margin: 0px;
  padding: 0px;
  border: 0px;
  overflow:hidden;
  list-style: none;
  outline:none;
  resize:none;
}
</style>
